<!DOCTYPE html>
<html lang="en">

    <head>
        <meta charset="UTF-8">
        <title>Title</title>


        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
        <meta name="description" content=""/>
        <meta name="author" content=""/>
        <link rel="icon" type="image/x-icon" href="assets/favicon.ico"/>
        <link rel="stylesheet" href="assets/css/mycss/readbook.css">
        <script src="js/jquery-3.5.1.min.js"></script>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/css/bootstrap.min.css" rel="stylesheet">
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.2/dist/js/bootstrap.bundle.min.js"></script>
        <!--        <script type="text/javascript" src="//lf-cdn-tos.bytescm.com/obj/static/toutiao/muye/Reader.725de282.js"></script>-->
        <!--        <script type="text/javascript" src="//lf-cdn-tos.bytescm.com/obj/static/toutiao/muye/js/index_9f10b90c.js"></script>-->
        <script type="text/javascript">
            $(document).ready(function () {


                $.ajax({
                    url: '/bookservlet',
                    dataType: 'json',
                    type: 'POST',
                    data: {option: 'getChapterId'},
                    success: function (returnValue) {
                        // alert(returnValue[0]);
                        var book = returnValue.book;
                        var pages = returnValue.pages;

                        // alert(book.book_name)
                        var name = $("<a href=\"##\" >" + book.book_name + "</a>")

                        var author = $("<a href=\"##\" >" + book.book_author + "</a>")

                        $('#bname').append(name)
                        $('#auhtor').append(author)


                        var count = 0;
                        for (var i = 0; i < pages.length; i++) {
                            var p = $("<p>" + pages[i] + "</p>")
                            count += pages[i].length
                            $("#index").append(p)
                        }
                        $('#nums').text('本章字数：' + count)
                        $('#pagename').text(returnValue.pagename)


                    }
                })
            })


        </script>
        <style>
            a{
                color: rgba(70,46,11,.6);
                text-decoration:none
            }
        </style>
    </head>
    <body>
        <div class="mycs">
            <div class="muye-reader-inner">
                <!--                <div class="muye-reader-catalog-btn-wrap">
                                    <div class="muye-reader-opr-btn catalog">目录</div>
                                </div>-->


                <div class="read-box">
                    <h1 class="muye-reader-title" id="pagename">章节名</h1>
                    <div class="muye-reader-desc">
                      <span class="desc-item">
                         <span class="title" id='bname'>书名：</span>
                      </span>
                        <span class="desc-item">
                             <span class="title" id="auhtor">作者：</span></span>
                        <span class="desc-item">
                            <span class="title" id='nums'>本章字数：</span>
                        </span>
                        <span class="desc-item">
<!--                        <span class="title">更新时间：</span>2022-01-18 21:15:44</span></div>-->
                        </span>

                        <div class="muye-reader-content " id="index">

                        </div>

                    </div>

                </div>


            </div>
    </body>
</html>

